/*
  学习目标：useEffect 挂载和卸载清理综合写法
  建议：
  按照业务功能走，同一个业务功能，就写在一个 useEffect 中

  需求：
  1. 监听浏览器窗口改变业务
  2. 页面开启定时器业务
*/

import React, { useEffect, useState } from 'react';

export default function App() {
  // 1. 监听浏览器窗口改变业务
  useEffect(() => {
    const winFn = () => console.log('窗口大小改变了');
    window.addEventListener('resize', winFn);

    return () => window.removeEventListener('resize', winFn);
  }, []);

  // 2. 页面开启定时器业务
  useEffect(() => {
    let timer = setInterval(() => {
      console.log('我是倒计时业务 -----> ');
    }, 1000);
    return () => {
      clearInterval(timer);
    };
  }, []);

  return <div>我是App</div>;
}
